<template>
  <view class="container">
    <u-sticky bgColor="#f4f5f9">
      <u-tabs :list="navList" @change="tabClick" :current="tabCurrentIndex"></u-tabs>
    </u-sticky>
    <u-list @scrolltolower="scrolltolower">
      <u-list-item v-for="(item, index) in approveList" :key="index">
        <view class="item-wrap" @click="goDetail(item)">
          <view class="item-wrap_row">
            <view class="title fl1">{{ item.sourceCode }}</view>
            <button class="item-wrap_row_btn">{{ sourceTypeList[item.sourceType].name }}</button>
          </view>
          <view class="item-wrap_row mg-t-10">
            <view class="label fl1">申请人</view>
            <view class="fl1">{{ item.applyUserName }}</view>
          </view>
          <view class="item-wrap_row mg-t-10">
            <view class="label fl1">申请时间</view>
            <view class="fl1">{{ item.applyTime }}</view>
          </view>
          <view class="item-wrap_row mg-t-10">
            <view class="label fl1">当前节点</view>
            <view class="fl1">{{ tabCurrentIndex === 0 ? item.currentNodeUserName : item.currentNodeUserName }}</view>
          </view>
          <view class="item-wrap_row mg-t-10">
            <view class="label fl1">当前节点时间</view>
            <view class="fl1">{{ item.newApplyTime }}</view>
          </view>
        </view>
      </u-list-item>
    </u-list>
  </view>
</template>

<script>
import { debounce, getScreen } from '@/service/auth'
import { getTaskApprove, getOperationLog } from '@/service/api/common_down'
export default {
  data() {
    return {
      tabCurrentIndex: 0,
      navList: [{ name: '未审批' }, { name: '我的' }],
      size: 20,
      page: 1,
      end: false,
      curScroll: 0,

      approveList: [],
      sourceTypeList: [
        { id: 0, name: ' ' },
        { id: 1, name: '费用合同 ' },
        { id: 2, name: '费用支付' },
        { id: 3, name: '请假申请' }, //普通人员
        { id: 4, name: '请假申请' }, //经理
        { id: 5, name: '销售订单' },
        { id: 6, name: '回瓶回箱' },
        { id: 7, name: '补卡申请' }, //普通
        { id: 8, name: '补卡申请' }, //经理
        { id: 9, name: '采购申请' }, //2000以下
        { id: 10, name: '采购申请' }, //2000以上
      ],
    }
  },
  created() {},
  onShow() {
    // uni.$on('refreshData', res => {
    //   if (res.refresh) {
    //     //更新数据
    //     this.refreshData()
    //   }
    // })
    this.refreshData()
  },
  computed: {},

  mounted() {
    
  },
  methods: {
    refreshData() {
      this.init()
      this.getList()
    },
    tabClick(e) {
      this.end = false
      this.page = 1
      this.tabCurrentIndex = e.index
      this.approveList = []
      this.getList()
    },

    init() {
      this.end = false
      this.page = 1
      this.approveList = []
    },
    getList() {
      const data = {
        size: this.size,
        page: this.page,
      }
      this.uniShowLoading()
      if (this.tabCurrentIndex === 0) {
        getTaskApprove(data)
          .then(res => {
            this.uniHideLoading()
            uni.stopPullDownRefresh()
            // console.log('res=' + JSON.stringify(res))
            if (res.data.content.length < this.size) this.end = true
            this.approveList = this.approveList.concat(res.data.content)
          })
          .catch(err => {
            this.uniHideLoading()
            uni.stopPullDownRefresh()
            uni.showToast({
              title: err.msg,
              icon: 'none',
            })
          })
      } else {
        getOperationLog(data)
          .then(res => {
            this.uniHideLoading()
            uni.stopPullDownRefresh()
            if (res.data.content.length < this.size) this.end = true
            this.approveList = this.approveList.concat(res.data.content)
          })
          .catch(err => {
            this.uniHideLoading()
            uni.stopPullDownRefresh()
            uni.showToast({
              title: err.msg,
              icon: 'none',
            })
          })
      }
    },
    goDetail(item) {
      if (item.sourceType === '3' || item.sourceType === '4') {
        uni.navigateTo({
          url: `/pageAttendance/pages/attendance/askForLeave/detail?item=` + JSON.stringify(item),
        })
      }
    },
    scrolltolower() {
      if (this.end) return
      this.page++
      this.getList()
    },
    onPullDownRefresh() {
      this.refreshData()
    },
  },
}
</script>

<style lang="scss" scoped>
.container {
  background-color: #f4f5f9;
  /* height: 100%;
  min-height: 100vh; */
  padding: 20rpx;
  .item-wrap {
    background-color: white;
    border-radius: 10rpx;
    margin-top: 20rpx;
    padding: 20rpx;
    &_row {
      display: flex;
      justify-content: space-between;
      .title {
        font-size: 32rpx;
        font-weight: bold;
      }
      &_btn {
        width: 180rpx;
        height: 70rpx;
        line-height: 70rpx;
        font-size: 28rpx;
        background: linear-gradient(to bottom, #5dd39c, #3bc086);
        color: white;
      }
      .label {
        color: #888;
      }
    }
  }
}
</style>
